<template>
  <div>
    <el-row style="line-height: 35px; ">
      <el-col :span="15">
        <el-button icon="el-icon-back"
                   size="small"
                   type="text"
                   @click="$router.go(-1)">返回</el-button>
        <span> | 子任务历史 </span>
      </el-col>
      <el-col :span="9">
        <el-input placeholder="请输入任务名称" v-model="searchHistoryParam.taskName" @keyup.enter.native="selectHistory">
          <el-button slot="append" icon="el-icon-search" @click="selectHistory"></el-button>
        </el-input>
      </el-col>
    </el-row>
    <el-table :data='historyList'
              :height="tableHeight"
              stripe
              use-virtual>
      <el-table-column label="任务名称" min-width="300px" show-overflow-tooltip>
        <template slot-scope="scope">
          <span v-html="scope.row.taskName"/>
        </template>
      </el-table-column>
      <el-table-column label="类型" show-overflow-tooltip>
        <template slot-scope="scope">
          <span v-html="scope.row.type === 0 ? '单条' : '批量'"></span>
        </template>
      </el-table-column>
      <el-table-column label="创建人" prop="createdBy">
        <template slot-scope="scope">
          <span v-html="$store.state.userList.find(item => item.userName === scope.row.createdBy).name"></span>
        </template>
      </el-table-column>
      <el-table-column label="创建时间" prop="updatedTime"/>
      <el-table-column label="状态" prop="status">
        <template slot-scope="scope">
          <span v-html="scope.row.status === 0 ? '进行中' : '已完成'"></span>
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作">
        <template slot-scope="scope">
          <span><el-link v-if="scope.row.status === 0" @click.prevent="editTask(scope.row)">编辑</el-link></span>
          <span><el-link v-if="scope.row.status === 0" @click.prevent="deleteTask(scope.row)">删除</el-link></span>
          <span><el-link v-if="scope.row.status === 1" @click.prevent="showHistoryDetail(scope.row)">详情</el-link></span>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :page-size="searchHistoryParam.pageSize"
      :page-sizes="[5, 10, 15, 20, 50, 100]"
      :total="total"
      background
      layout="total, sizes, prev, pager, next, jumper"
      style="text-align: right;"
      @current-change="handleCurrentChange"
      @size-change="handleSizeChange"></el-pagination>
  </div>
</template>

<script>
  export default {
    name: "TaskHistory",
    data() {
      return {
        tableHeight: CONST.WORKSPACE_HEIGHT - 85,
        historyList: [],
        total: 0,
        searchHistoryParam: {
          pageSize: 10,
          currentPage: 1,
          taskName: '',
        }
      }
    },
    methods: {
      handleSizeChange(value) {
        this.searchHistoryParam.pageSize = value
        this.selectHistory()
      },
      //分页
      handleCurrentChange: function (val) {
        this.searchHistoryParam.currentPage = val;
        this.selectHistory();
      },
      // 只有正在进行中的任务(批量), 可以删除;
      editTask(taskHistory) {
        this.axios.get('/pmph/action/knowledgeUnit/editTask',
          {params: {
              taskId: taskHistory.id
            }})
          .then((response) => {
            this.$store.commit('setKnowledgeList', response.data.knowledgeList)
            this.$store.commit('setKnowledgeUnitFieldList', response.data.knowledgeUnitFieldList)
            let taskItem = {
              taskId: taskHistory.taskId,
              remark: taskHistory.remark
            }
            this.$store.commit('setTaskItem', taskItem)
            this.$router.push('/multiCreateKnowledge')
          })
      },
      // 只有正在进行中的任务(批量), 可以删除;
      deleteTask(taskHistory) {
        this.axios.get('/pmph/action/knowledgeUnit/deleteTask',
          {params: {
              taskId: taskHistory.id
            }})
          .then(() => {
            this.historyList.remove(taskHistory)})
      },
      showHistoryDetail(taskHistory) {
        if(taskHistory.type === 0) {
          this.axios.get('/pmph/action/knowledgeUnit/selectTaskItemDetail',
            {params: {
                taskId: taskHistory.id
              }})
            .then((response) => {
              this.$store.commit('setEditingKnowledge', response.data.knowledge)
              this.$store.commit('setKnowledgeList', [response.data.knowledge])
              this.$router.push('/material/taskItemDetail')
            })
        }
        else {
          this.$store.commit('setKnowledgeUnitParseKnowledgeTaskId', taskHistory.id)
          this.$router.push('/material/taskItemHistory')
        }
      },
      selectHistory() {
        this.axios.get('/pmph/action/knowledgeUnit/selectHistoryPage',
        {params: this.searchHistoryParam})
          .then((response) => {
            this.historyList = response.data.records
            this.total = response.data.total
          })
      },
    },
    created() {
      this.selectHistory()
    }
  }
</script>

<style scoped>

</style>
